Skip to main content

Card How To's

How to's for the Card guide.

What Is Card?​

What Is Card?​

Card is a visualization object that enables data retrieved on a form to be displayed in card layouts.
With this object, users can review large amounts of data through summarized and readable cards instead of tables.

The Card object is especially preferred in:

  • Dashboard screens
  • Summary information displays
  • KPI, status, and numeric value presentations

Primary Purpose​

  • To allow users to quickly see key information without diving into details
  • To present data with a more modern and user-friendly interface
  • To reduce table complexity

Usage Scenarios​

  • Sales summaries (Total Sales, Monthly Revenue, Number of Orders)
  • User statistics
  • Process statuses
  • Summary reporting screens

Features​

  • Displays data from a data source in a card format
  • Multiple cards can be displayed side by side or stacked vertically
  • Title-, description-, and value-based presentations can be created
  • Suitable for responsive (adaptive) designs

Notes​

  • The Card object is read-only; direct data entry is not supported
  • Visualization and user experience are the primary focus

How to Use Card?​

How to Use Card?​

The following steps should be followed to use the Card object on a form.

Add the Card Object to the Form​

  1. Open the form design screen
  2. Go to the Toolbox panel
  3. Locate the Card object
  4. Add the object to the form using drag / drop

Define the Data Source​

  1. Click the Card object
  2. The Property Viewer panel opens on the right
  3. Select a data source from the Data Source field
  4. Configure the fields to be displayed on the card

Configure the Card Content​

  • Card title (Title)
  • Value to be displayed (Value)
  • Description or additional information (Description)
  • Icon or style settings, if needed

These fields make the card content more meaningful for the user.

Run the Form​

  1. Save the form
  2. Perform the Run / Publish action
  3. Open the form in the web interface
  4. Observe that the data is displayed in card format

Example Usage​

  • Total number of customers card
  • Monthly sales amount card
  • Pending approval count card

Tips​

  • Test the responsive layout as the number of cards increases
  • Using Card together with Chart is recommended on dashboard pages
  • Prefer contrasting colors for critical information

Notes​

  • The Card object is for display purposes only
  • Data freshness depends on the connected data source

How to Use Client Enabled?​

What is Client Enabled?​

Client Enabled is a property that defines whether a form control is active (enabled) on the client side when the form is first loaded.
If it is set to True, the control is immediately usable by the user.
If it is set to False, the control is disabled and cannot be interacted with until a specific condition or rule activates it.

This property is especially useful for controlling the user’s interaction flow and applying dynamic behaviors using the Rule Manager.

What Does It Do?​

The property allows developers to:

  • Control when a form control becomes interactive.
  • Prevent users from entering or changing data until prerequisites are met.
  • Dynamically enable or disable controls based on user input or logic.

Example Scenario — Conditional Activation​

Scenario:
A form contains a checkbox called “I Accept Terms” and a text field called “Signature.”
The goal is to make the “Signature” field inactive until the user checks “I Accept Terms.”

Steps to Implement:​

  1. Select the “Signature” field in the form editor.

  2. In the Properties panel, find the Client Enabled field.

  3. Set the value to False — the field will now be disabled by default when the form loads.

  4. Open the Rule Manager.

  5. Add a new rule:

    Condition:

Action:

  1. Save and publish the form.

Result:​

  • When the form loads, the “Signature” field is disabled.
  • Once the user checks “I Accept Terms,” the field automatically becomes active and editable.

Behavior Summary​

Property StateDescription
TrueThe control is active and ready for user interaction when the form loads.
FalseThe control is disabled at load time and can be enabled dynamically via rules or code.

Notes & Best Practices​

  • Use the Client Enabled property to manage client-side interactivity without requiring server actions.
  • Combine it with Rule Manager to define when and how controls become active.
  • Remember: if server enablement is disabled, the client cannot enable the control even if Client Enabled is set to True.
  • By default, this property is set to True (active).

Summary​

Client Enabled improves form usability by letting developers control when and how users interact with form controls.
It is essential for creating responsive, condition-based form experiences where user actions dynamically change the form’s state.